<template>
	<view style="padding-bottom: 500rpx;">
		<up-form labelPosition="left" class="apply-form-field" :labelStyle="labelStyle" :borderBottom="true"
			ref="wuLiuRef" :model="wuLiu" v-if="wuLiu.id!=null">
			<view v-if="wuLiu.trackingNumber==null">
				<up-form-item :borderBottom="true" label-width="140" label="车牌号"  prop="carCard">
					<!-- <up-input v-model="wuLiu.carCard" readonly></up-input> -->
					<u-text :text="wuLiu.carCard" decoration="underline" type="primary" size="17" style="height: 45rpx;" @click="copyOrder"></u-text>
				</up-form-item>
				<up-form-item :borderBottom="true" label-width="140" label="承运司机"  prop="carryDriver">
					<up-input v-model="wuLiu.carryDriver" readonly></up-input>
				</up-form-item>
				<up-form-item :borderBottom="true" label-width="140" label="手机号"  prop="phone">
					<up-input v-model="wuLiu.phone" readonly></up-input>
				</up-form-item>
				<up-form-item :borderBottom="true" label-width="140" label="预计到园区时间"  prop="arrivalTime">
					<up-input v-model="wuLiu.arrivalTime" readonly></up-input>
				</up-form-item>
				<up-form-item :borderBottom="true" label-width="140" label="车辆内径"  prop="insideDiameter" v-if="wuLiu.carModel!=null &&wuLiu.carModel!=''">
					<up-input v-model="wuLiu.insideDiameter" readonly></up-input>
				</up-form-item>
				<up-form-item :borderBottom="true" label-width="140" label="物流供应商"  prop="logisticsProvider" v-if="wuLiu.carModel!=null &&wuLiu.carModel!=''">
					<up-input v-model="wuLiu.logisticsProvider" readonly></up-input>
				</up-form-item>
				<up-form-item :borderBottom="true" label-width="140" label="总费用"  prop="cost" v-if="wuLiu.carModel!=null &&wuLiu.carModel!=''">
					<up-input v-model="wuLiu.cost" readonly></up-input>
				</up-form-item>
				<up-form-item :borderBottom="true" label-width="140" label="车型"  prop="carModel" v-if="wuLiu.carModel!=null &&wuLiu.carModel!=''">
					<up-input v-model="wuLiu.carModel" readonly></up-input>
				</up-form-item>
				<up-form-item :borderBottom="true" label-width="140" label="费用明细"  prop="carModel" v-if="wuLiu.carModel!=null &&wuLiu.carModel!=''">
					<div>
						{{wuLiu.logisticsCost + '(物流费/元)、' + wuLiu.escortCost + '(押车费/元)、'
                          +
                          wuLiu.passCost + '(过路费/元)、' + wuLiu.missCost + '(误车费/元)、'
                          + wuLiu.otherCost + '(其他费用/元)'}}
					</div>
				</up-form-item>
			</view>
			<view v-else>
				<up-form-item :borderBottom="true" label-width="140" label="快递单号"  prop="trackingNumber">
					<u-text :text="wuLiu.trackingNumber" decoration="underline" type="primary" size="17" style="height: 45rpx;" @click="copyOrder"></u-text>
					<!-- <up-input v-model="wuLiu.trackingNumber" readonly></up-input> -->
				</up-form-item>
				<up-form-item :borderBottom="true" label-width="140" label="快递公司"  prop="expressCompany">
					<up-input v-model="wuLiu.expressCompany" readonly></up-input>
				</up-form-item>
				<up-form-item :borderBottom="true" label-width="140" label="发货时间"  prop="deliveryTime">
					<up-input v-model="wuLiu.deliveryTime" readonly></up-input>
				</up-form-item>
			</view>

		</up-form>
		<up-empty style="height: 630rpx;" height="160" text="暂未分配物流信息" v-else></up-empty>
	</view>
</template>

<script>
	import { onUpdated } from 'vue';
    import wuliuApi from '@/apis/gyl/wuliu.js';
	import {copyOrderWuliu} from '@/utils/copy.js'
	export default {
		props:{
			data:{
				type:String,
				default:null
			}
		},
		data() {
			return {
				labelStyle: {
					color: '#aaa',
					fontSize: '30rpx'
				},
				wuLiu: {},
				id: null,
			}
		},
		methods: {
			
			copyOrder(){
				this.$emit("getOrderNum",(data)=>{
					 copyOrderWuliu(this.wuLiu,data)
					}
				)
			},
			/**
			 * 获取物流数据
			 */
			async getWUliu() {
				const res = await wuliuApi.getLogisic(this.id);
				if (res.success) {
					if (res.data) {
						this.wuLiu = res.data;
					} else {
						this.wuLiu = {};
					}

				}
			},
		},
		mounted() {		
			this.id = this.data;
			this.getWUliu();
		}
	}
</script>

<style scoped>
    .u-form{
		/* margin-bottom: 100rpx; */
		padding-bottom: 10rpx;
    	border: 1px solid #bdbdbd;
   /* 	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3); */
    	border-radius: 15px;
    }
</style>